<template>
    <!-- tabbar -->
    <van-tabbar v-model="active">
        <van-tabbar-item icon="wap-home" :to="'/' + common.extConfig.storeId + item.pagePath + '/' + common.wid" v-for="item in list" :key="item.text">
            <span>{{item.text}}</span>
            <img
                slot="icon"
                slot-scope="props"
                :src="props.active ? item.selectedIconPath : item.iconPath"
            >
        </van-tabbar-item>
    </van-tabbar>
</template>

<script>
// 解构 辅助函数
import { mapState } from 'vuex'

export default {
  props: ["tabbarActive", "list"],
  data() {
    return {
      // 选中状态
      active: this.tabbarActive,
      // 首页小图标
      homeIcon: {
        normal: require("Img/tabbar/home_normal.png"),
        active: require("Img/tabbar/home_active.png")
      }
    }
  },
  computed: {
    ...mapState(['common'])
  }
}
</script>

<style lang="stylus">
@import '~Css/_variable.styl';

.van-tabbar 
    box-shadow $shadowColor
    .van-tabbar-item--active
        color #FCC600
</style>
